<!DOCTYPE html>
<html>
	<head>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1" />
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="__TMPL__/public/assets/js/flexible.js" ></script>
		<link rel="stylesheet" href="__TMPL__/public/assets/css/all_page.css" />
		<link rel="stylesheet" href="__TMPL__/public/assets/css/public.css" />
		<link rel="stylesheet" href="__TMPL__/public/assets/css/mobiscroll.css" />
		<link rel="stylesheet" href="__TMPL__/public/assets/css/mobiscroll_002.css" />
		<link rel="stylesheet" href="__TMPL__/public/assets/css/mobiscroll_003.css" />
		<style>
			
		</style>
	</head>
	<body>
		
		<div class="meLeave leave repairs">
			<!--头部-->
			<div class="top" style="background: url({:cmf_get_image_url($img['img'])}) no-repeat;background-size: 100% 100%;">
				<p>我的留言诉求</p>
			</div>
			
			<div class="leaveCn">
				<volist name="data" id='v'>
				<div class="leaList">
					<div class="leTop div_float">
						<p class="LeType">类型：<span>{$v['name']}</span></p>
						<p class="state">时间：{:date('Y-m-d',$v['time'])}</p>
					</div>    
					<div class="leM div_float">
						<label>内容：</label>
						<div class="leMMsg">
							{$v['content']}
						</div>
					</div>
					<div class="leM div_float">
						<label>回复：</label>
						<div class="leMMsg">
							{$v['reply']}
						</div>
					</div>
				</div>
				</volist>
				<!-- <div class="leaList">
					<div class="leTop div_float">
						<p class="LeType">类型：<span>投诉</span></p>
						<p class="state">时间：2018-06-28</p>
					</div>    
					<div class="leM div_float">
						<label>内容：</label>
						<div class="leMMsg">
							调用问题关于公共资源的调用问题关于公共资源的调用问题关于公共资源的调用问题关于公共资源的调用问题
						</div>
					</div>
					<div class="leM div_float">
						<label>回复：</label>
						<div class="leMMsg">
							关于公共资源的回复关于公共资源的回复关于公共资源的回复
						</div>
					</div>
				</div>
				
				<div class="leaList">
					<div class="leTop div_float">
						<p class="LeType">类型：<span>投诉</span></p>
						<p class="state">时间：2018-06-28</p>
					</div>    
					<div class="leM div_float">
						<label>内容：</label>
						<div class="leMMsg">
							调用问题关于公共资源的调用问题关于公共资源的调用问题关于公共资源的调用问题关于公共资源的调用问题
						</div>
					</div>
					<div class="leM div_float">
						<label>回复：</label>
						<div class="leMMsg">
							关于公共资源的回复关于公共资源的回复关于公共资源的回复
						</div>
					</div>
				</div> -->
			</div>
			
			
			<!--公共底部-->
			<include file='public@footer'/>
			
		</div>
		
	
	<script type="text/javascript" src="__TMPL__/public/assets/js/jquery-1.8.3.js" ></script>
	<script type="text/javascript" src="__TMPL__/public/assets/js/js.js" ></script>
	<script type="text/javascript" src="__TMPL__/public/assets/js/mobiscroll.custom-2.5.2.min.js" ></script>
	<script type="text/javascript" src="__TMPL__/public/assets/js/mobiscroll_003.js" ></script>
	<script type="text/javascript" src="__TMPL__/public/assets/js/lrz.all.bundle.js" ></script>
	<script>
		$(function(){
			$("#faType").click(function() {
				var that = this;
				$("#faType-list").mobiscroll().treelist({
					theme: "android-ics",
					lang: "zh",
					display: 'bottom',
					headerText: '请您选择',
					onSelect: function(valueText) {
						var m = $(this).find("li").eq(valueText).html();
						$(that).val(m);
						$('#faTypeText').html(m)
					}
				});
				$("input[id^=faType-list]").focus();
			});
			
			$('.takePto').on('click',function(){
				var numLen = $('.photo>div').length;
				if(numLen < 3){
					$('.photoInput').click();
				}else{
					alert('最多上传3张凭证！')
				}
			});
			
			$('.photoInput').change(function() {
				if($(this)[0].files[0].size>1048576){
					alert('请上传100*100像素 或者大小小于1M的图片')
				}else{
					lrz(this.files[0], {
						width: 1024
					})
					.then(function(rst) {
						// 把处理的好的图片给用户看看呗（可选）
						var img = new Image();
						img.src = rst.base64; //base64字符串
						
			            renderPhoto(rst.base64);
						
					});
				}
			});
		})
		
		
		//渲染图片 para:最新选择图片的base64
		function renderPhoto(para){
			var newImg = para;
			var oldImg = [];
			if(newImg != "null" || typeof(newImg) == 'object'){
				
				if(typeof(newImg) == 'object'){
					$.each(newImg, function(index,item) {
						console.log()
						oldImg.push($(this)[0]);
					});
				}else{
					oldImg.push(newImg);
					$.each($('.photo>div'), function(index,item) {
						oldImg.push($(this).find('img').attr('src'));
					});
				}
			}
			
			
			
			$('.photo').empty();
			
			if(oldImg.length>0){
				$.each(oldImg,function(index,item){
					var temp = '<div class="tpList">';
					temp += '<img src="'+item+'" /><span onclick="delPhoto($(this))" value="'+index+'">×</span>';
					temp += '</div>';
					$('.photo').append(temp);
				})
			}
			
		}
		
		//删除图片
		function delPhoto(para){
			var cIndex = parseInt(para.index())-1;
			var oldImg = [];
			var newImg = [];
			
			$.each($('.photo>div'), function(index,item) {
				oldImg.push($(this).find('img').attr('src'));
			});
			
			$.each(oldImg,function(index,item){
				if(cIndex != index){
					newImg.push(item)
				}
			})
			
			para.parent().remove();
			
			
			if(newImg.length>0){
				renderPhoto(newImg);
			}else{
				renderPhoto('null');
			}
			
			
		}
		
	</script>
	</body>
</html>
